import { Link } from "react-router-dom";
import { motion } from "framer-motion";

export default function Home() {
  return (
    <div className="flex flex-col items-center justify-center min-h-screen bg-gray-50 p-4">
      <h1 className="text-4xl font-bold text-[#2C3E50] mb-12">学生成绩管理系统</h1>
      
      <div className="flex flex-col md:flex-row gap-8 w-full max-w-2xl">
        <motion.div
          whileHover={{ scale: 1.05 }}
          whileTap={{ scale: 0.95 }}
          className="flex-1"
        >
          <Link
            to="/teacher/login"
            className="block w-full bg-[#2C3E50] hover:bg-[#1a2635] text-white text-xl font-semibold py-8 px-6 rounded-lg shadow-md text-center transition-colors"
          >
            <div className="flex flex-col items-center">
              <i className="fas fa-chalkboard-teacher text-4xl mb-4"></i>
              <span>教师登录</span>
            </div>
          </Link>
        </motion.div>

        <motion.div
          whileHover={{ scale: 1.05 }}
          whileTap={{ scale: 0.95 }}
          className="flex-1"
        >
          <Link
            to="/student/login"
            className="block w-full bg-[#2C3E50] hover:bg-[#1a2635] text-white text-xl font-semibold py-8 px-6 rounded-lg shadow-md text-center transition-colors"
          >
            <div className="flex flex-col items-center">
              <i className="fas fa-user-graduate text-4xl mb-4"></i>
              <span>学生登录</span>
            </div>
          </Link>
        </motion.div>
      </div>
    </div>
  );
}